<template>
	<view class="page">
		<view class="uni-list">
            <radio-group @change="radioChange">
                <label class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in cardList" :key="item.id">
                    <view>{{item.bank}}  （卡号{{item.card_no}}）</view>
					<view>
					    <radio color="#d71611" :value="String(item.id)" :checked="index === current" />
					</view>
                </label>
            </radio-group>
        </view>
		<view class="m-loading" v-if="isShowLoading">
		    <image src="@/static/images/loading.gif" mode="widthFix"></image>
		    <text>加载中</text>
		</view>
	</view>
</template>


<script>
    import henglang from '@/common/common.js';
    
	export default {
		data() {
			return {
                cardBank: true,
				userInfo:{},
				cardList: [],
				current: -1,
				isShowLoading: false,
				cardId:'',
			};
		},
		
        methods: {
            radioChange: function(e) {
				let that = this;
				for (let i = 0; i < that.cardList.length; i++) {
					if (that.cardList[i].id == e.target.value) {
						that.current = i;
						that.cardId = that.cardList[i].id;
						uni.setStorageSync('selectCardId',that.cardId)
						uni.navigateBack()
						break;
					}
				}
			},
			getuserCard(e) {
				let that = this;
				that.isShowLoading = true;
				henglang.get('withdraw/getInfo',{},true,function(res){
					that.isShowLoading = false;
					that.cardList = res.data.data.bank;
					for (let i = 0; i < that.cardList.length; i++) {
						if (that.cardList[i].id === Number(e)) {
							that.current = i;
							uni.setStorageSync('selectCardId',that.cardList[i].id)
							break;
						}
					}
				});
			}
        },
		onLoad({id}) {
			this.getuserCard(id);
		}
	}
</script>

<style>
	/* 列表 */
.uni-list {
	background-color: #FFFFFF;
	position: relative;
	width: 100%;
	display: flex;
	flex-direction: column;
}
.uni-list-cell {
	position: relative;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
}
.uni-list-cell-pd {
	padding: 22upx 30upx;
}
.uni-list-cell::after {
	position: absolute;
    z-index: 3;
	right: 0;
	bottom: 0;
	left: 0upx;
	height: 1px;
	content: '';
	-webkit-transform: scaleY(.5);
	transform: scaleY(.5);
	background-color: #c8c7cc;
}
.uni-list .uni-list-cell:last-child::after {
	height: 0upx;
}
.uni-list-cell-last.uni-list-cell::after {
	height: 0upx;
}
</style>